<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/7/3
  Time: 9:58
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>电影院列表</title>
    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
    <link href='http://fonts.useso.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
    <link href="css/gozha-nav.css" rel="stylesheet" />
    <link href="css/external/jquery.selectbox.css" rel="stylesheet" />
    <link href="css/style.css?v=1" rel="stylesheet" />
    <script src="js/external/modernizr.custom.js"></script>
</head>
<body>
<div class="wrapper">
    <!-- 头部导航栏-->
    <hearder>
        <jsp:include page="header.jsp"></jsp:include>
    </hearder>
    <!-- 搜索框-->
    <jsp:include page="search.jsp"></jsp:include>

    <!-- Main content -->
    <section class="container">
        <div class="col-sm-12">
            <h2 class="page-heading">电影院</h2>

            <div class="tags-area tags-area--thin">
                <form id='select' class="select" method='get'>
                    <select name="select_item" id="select-sort" class="select__sort" tabindex="0">
                        <option value="1" selected='selected'>思明区</option>
                        <option value="2">集美区</option>
                        <option value="3">翔安区</option>
                        <option value="4">海沧区</option>
                        <option value="5">湖里区</option>
                    </select>
                </form>

                <div class="tags tags--unmarked tags--aside">
                    <span class="tags__label">伦敦按以下顺序排列:</span>
                    <ul>
                        <li class="item-wrap">
                            <a href="#" class="tags__item item-active" data-filter='all'>全</a>
                        </li>
                        <li class="item-wrap">
                            <a href="#" class="tags__item" data-filter='name'> 名字</a>
                        </li>
                        <li class="item-wrap">
                            <a href="#" class="tags__item" data-filter='popularity'>姓名</a>
                        </li>
                    </ul>
                </div>
            </div>

            <div class="cinema-wrap">
                <div class="row">
                    <div class="col-xs-6 col-sm-3 cinema-item">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">万达影城</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item name">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">又见影院</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item name popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                </div>

                <div class="adv-place"><img alt='' src="images/banners/film.jpg"></div>

                <div class="row">
                    <div class="col-xs-6 col-sm-3 cinema-item name">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item name popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                </div>

                <div class="adv-place"><img alt='' src="images/banners/film.jpg"></div>

                <div class="row">
                    <div class="col-xs-6 col-sm-3 cinema-item name">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 cinema-item popularity">
                        <div class="cinema">
                            <a href='single-cinema.html' class="cinema__images">
                                <img alt='' src="http://placehold.it/525x525">
                                <span class="cinema-rating">5.0</span>
                            </a>
                            <a href="single-cinema.html" class="cinema-title">...</a>
                        </div>
                    </div>
                </div>

            </div>

            <div class="pagination paginatioon--full">
                <a href='#' class="pagination__prev">返回顶部</a>
                <a href='#' class="pagination__next">下一页</a>
            </div>

        </div>
    </section>

    <!-- 底部-->
    <jsp:include page="footer.jsp"></jsp:include>



<!-- JavaScript-->
<!-- jQuery 1.9.1-->
<script src="http://ajax.useso.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
    window.jQuery || document.write('<script src="js/external/jquery-1.10.1.min.js"><\/script>')
</script>
<!-- Migrate -->
<script src="js/external/jquery-migrate-1.2.1.min.js"></script>
<!-- Bootstrap 3-->
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>

<!-- Mobile menu -->
<script src="js/jquery.mobile.menu.js"></script>
<!-- Select -->
<script src="js/external/jquery.selectbox-0.2.min.js"></script>

<!-- Form element -->
<script src="js/external/form-element.js"></script>
<!-- Form validation -->
<script src="js/form.js"></script>

<!-- Custom -->
<script src="js/custom.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        init_CinemaList();
    });
</script>
</body>
</html>
